/**
 * Copyright (c) 快宝网络 kuaidihelp.com Co., Ltd. All Rights Reserved 禁止外泄以及用于其它的商业用途
 */

import React from 'react';
import { Modal, Row, Col, Button } from 'antd';
import List from './List';
import { isArray } from 'lodash';

const Index: React.FC<{
  data: any;
  isOpened: boolean | undefined;
  onOk: Function;
  onCancel: Function;
  onRefund: (e: any) => void;
  queryData: any;
}> = (props) => {
  const { data, isOpened, onOk, onCancel, queryData, onRefund } = props;
  const { brand, passage_fee = 0, order_status } = data;
  const league = ['jd', 'sf', 'dp'].includes(brand);
  const canceledOrder = ['0'].includes(`${order_status}`);
  const orderSource = [
    {
      dataIndex: 'order_id',
      title: '订单号',
    },
    {
      dataIndex: 'third_order_id',
      title: '客户订单号',
    },

    {
      dataIndex: 'brand',
      title: '订单品牌',
      width: 200,
      renderText: (_: any, value: any) => {
        return queryData ? queryData.brand?.[value] : '';
      },
    },
    {
      dataIndex: 'order_status_name',
      title: '订单状态',
    },
    {
      dataIndex: 'package_note',
      title: '订单备注',
    },
    { dataIndex: 'cancel_reason', title: '订单取消原因', width: 140 },

    { dataIndex: 'create_at', title: '下单时间' },
    { dataIndex: 'collect_date', title: '接单时间', width: 170 },
    {
      dataIndex: 'collect_courier_name',
      title: '接单快递员',
      width: 150,
    },
    { dataIndex: 'collect_courier_mobile', title: '快递员手机号' },
  ];
  const shipperOrShippingSource = [
    { dataIndex: 'waybill_no', title: '运单号' },

    {
      dataIndex: 'receive_time',
      title: '实际揽件时间',
      width: 100,
    },

    {
      dataIndex: '',
      title: '揽件业务员',
      width: 130,
    },
    {
      dataIndex: '',
      title: '揽件业务员电话',
      width: 130,
    },
  ];
  const collectSource = [
    { dataIndex: 'user_id', title: '用户ID' },
    {
      dataIndex: 'user_type',
      title: '用户属性',
      renderText: (d: any) => {
        const userType = {
          user: '团员',
          regiment: '团长',
        };
        return userType[d.user_type];
      },
    },
    { title: '注册时间', dataIndex: 'register_time' },
    { title: '所属加盟商', dataIndex: 'league_name' },
    { title: '加盟商联系方式', dataIndex: 'league_phone' },
    { title: '所属团长', dataIndex: 'regiment_name' },
    { title: '团长联系方式', dataIndex: 'regiment_mobile' },
    {
      title: '寄件人信息',
      dataIndex: '',
      renderText: (d: any) => {
        return (
          <div>
            <p>
              {d.shipper_name} {d.shipper_mobile}
            </p>
            <p>
              {d.shipper_province}-{d.shipper_city}-{d.shipper_county}-{d.shipper_address}
            </p>
          </div>
        );
      },
    },
    {
      title: '收件人信息',
      dataIndex: '',
      renderText: (d: any) => {
        return (
          <div>
            <p>
              {d.shipping_name} {d.shipping_mobile}
            </p>
            <p>
              {d.shipping_province}-{d.shipping_city}-{d.shipping_county}-{d.shipping_address}
            </p>
          </div>
        );
      },
    },
  ];

  const priceFormat = (param: { name: string; type: string; fee: string }[] | any) => {
    if (isArray(param)) {
      return param.length > 0
        ? param.map((item: { name: string; fee: string }, index: number) => {
            return (
              <div key={index}>
                {item.name}: {item.fee}
              </div>
            );
          })
        : '-';
    } else {
      return '-';
    }
  };
  const packageorpaySource = [
    { dataIndex: 'package_info', title: '物品名称', width: 90 },

    { dataIndex: 'delivery_type_name', title: '产品类型', width: 90 },

    { dataIndex: 'pay_method_name', title: '付款类型', width: 90 },
    { dataIndex: 'charging_weight', title: '结算重量', width: 90 },
    { dataIndex: 'settlement_volume', title: '结算体积', width: 90 },
    {
      dataIndex: 'settlement_price_details',
      title: '费用明细',
      width: 90,
      renderText: (d: any) => {
        const { settlement_price_details = '', freight } = d;
        const price_details = settlement_price_details ? JSON.parse(settlement_price_details) : [];
        const settlement_data = [{ name: '运费', fee: freight }, ...price_details];
        return priceFormat(settlement_data);
      },
    },
    { dataIndex: 'pay_price', title: '团员已支付金额', width: 90 },
    { dataIndex: 'regiment_pay_price', title: '团长已支付金额', width: 90 },
    {
      dataIndex: 'admin_discount_rate',
      title: !league ? '团长首重加收费' : '团长折扣率',
      width: 90,
    },
    { dataIndex: 'admin_s_fee', title: '团长续重加收费', hide: league, width: 90 },
    {
      dataIndex: 'user_discount_rate',
      title: !league ? '团员首重加收费' : '团员折扣率',
      width: 90,
    },
    { dataIndex: 'user_s_fee', title: '团员续重加收费', hide: league, width: 90 },

    {
      dataIndex: 'calculate_price_type',
      title: '计费方式',
      width: 90,
      renderText: (d: any) => {
        const { calculate_price_type } = d;
        const price_type = { '1': '重量', '2': '体积' };
        return price_type[calculate_price_type];
      },
    },
    { dataIndex: 'league_profit', title: '加盟商利润', width: 90 },
    { dataIndex: 'regiment_profit', title: '团利润', width: 90 },
    { dataIndex: 'pay_status_name', title: '结算状态', width: 90 },
    { dataIndex: 'order_number', title: '支付商户号', width: 90 },
    { dataIndex: 'trade_number', title: '交易流水号', width: 90 },
    {
      dataIndex: 'passage_fee',
      title: '京东通道费',
      hide: passage_fee <= 0,
      width: 90,
    },
  ];
  const handleCancel = () => {
    onCancel();
  };
  const handleOk = () => {
    onOk();
  };

  return (
    <Modal
      title='详情信息'
      open={isOpened}
      width={1000}
      onCancel={handleCancel}
      onOk={handleOk}
      footer={[
        !canceledOrder ? (
          <Button key='back' onClick={onRefund}>
            仅快宝退款
          </Button>
        ) : null,
        <Button key='submit' type='primary' onClick={handleOk}>
          确定
        </Button>,
      ]}
    >
      <Row justify='space-between' style={{ width: '100%' }}>
        <Col xs={12} md={12} lg={6} xl={6} xxl={6}>
          <List data={data} options={orderSource} title='订单信息' />
        </Col>
        <Col xs={24} md={24} lg={12} xl={12} xxl={12}>
          <List data={data} options={shipperOrShippingSource} title='运单信息' />
          <List data={data} options={collectSource} title='收寄件信息' />
        </Col>
        <Col xs={12} md={12} lg={6} xl={6} xxl={6}>
          <List data={data} options={packageorpaySource} title='物品及支付信息' />
        </Col>
      </Row>
    </Modal>
  );
};

export default Index;
